<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<head>
    <th:block th:include="include :: header('车辆预配置记录列表')" />
</head>
<body class="gray-bg">
<div class="container-div">
    <div class="row">
        <div class="col-sm-12 search-collapse">
            <form id="formId">
                <div class="select-list">
                    <ul>
                        <li>
                            <label>配置名称：</label>
                            <input type="text" name="configName" placeholder="配置名称"/>
                        </li>
                        <li>
                            <label>车辆类型：</label>
                            <input type="text" name="carTypeName" placeholder="车辆类型"/>
                        </li>
<!--                        <li>-->
<!--                            <label>终端编号：</label>-->
<!--                            <input type="text" name="oldTerminalNum" placeholder="新旧终端编号"/>-->
<!--                        </li>-->
<!--                        <li>-->
<!--                            <label>反馈人：</label>-->
<!--                            <input type="text" name="feedbackPeopleName"/>-->
<!--                        </li>-->
<!--                        <li>-->
<!--                            <label>更改人：</label>-->
<!--                            <input type="text" name="changePeopleName"/>-->
<!--                        </li>-->
<!--                        <li class="select-time">-->
<!--                            <label>日期：</label>-->
<!--                            <input type="text" class="time-input" id="startTime" placeholder="开始时间" name="params[beginCreateDate]"/>-->
<!--                            <span>-</span>-->
<!--                            <input type="text" class="time-input" id="endTime" placeholder="结束时间" name="params[endCreateDate]"/>-->
<!--                        </li>-->
                        <li>
                            <a class="btn btn-primary btn-rounded btn-sm" onclick="$.table.search()"><i class="fa fa-search"></i>&nbsp;搜索</a>
                            <a class="btn btn-warning btn-rounded btn-sm" onclick="$.form.reset()"><i class="fa fa-refresh"></i>&nbsp;重置</a>
                        </li>
                    </ul>
                </div>
            </form>
        </div>

        <div class="btn-group-sm" id="toolbar" role="group">
            <!--                <a class="btn btn-success" onclick="$.operate.add()" shiro:hasPermission="car:carUpdateRecord:add">-->
            <!--                    <i class="fa fa-plus"></i> 添加-->
            <!--                </a>-->
            <!--                <a class="btn btn-primary single disabled" onclick="$.operate.edit()" shiro:hasPermission="car:carUpdateRecord:edit">-->
            <!--                    <i class="fa fa-edit"></i> 修改-->
            <!--                </a>-->
            <!--                <a class="btn btn-danger multiple disabled" onclick="$.operate.removeAll()" shiro:hasPermission="car:carUpdateRecord:remove">-->
            <!--                    <i class="fa fa-remove"></i> 删除-->
            <!--                </a>-->
            <a class="btn btn-warning" onclick="$.table.exportExcel()" shiro:hasPermission="car:config:export">
                <i class="fa fa-download"></i> 导出
            </a>
        </div>
        <div class="col-sm-12 select-table table-striped">
            <table id="bootstrap-table"></table>
        </div>
        <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
            <div class="modal-dialog modal-lg" role="document">
                <div class="modal-content">
                    <ul class="jumbotron">
                        <h3>车辆预配置详细参数</h3>
                        <h4>配置名称:<span name="main-config-name"></span></h4>
                        <ul class="list-group">
                            <li name="config-weight" class="list-group-item "></li>
                            <li name="carWide" class="list-group-item "></li>
                            <li name="carPassengers" class="list-group-item "></li>
                            <li name="fuelConsumptionHunder" class="list-group-item "></li>
                            <li name="ratioGear" class="list-group-item "></li>
                            <li name="pureBatteryRange" class="list-group-item "></li>
                            <li name="maxSpeed" class="list-group-item "></li>
                            <li name="maxSpeed30m" class="list-group-item "></li>
                            <li name="powerHundred" class="list-group-item "></li>
                        </ul>
                    </ul>
                </div>
            </div>
        </div>
        <div class="modal fade" id="myConfigModel" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
            <div class="modal-dialog modal-lg" role="document">
                <div class="modal-content">
                    <ul class="jumbotron">
                        <h3>配置详细信息</h3>
                        <h4>配置名称:<span name="main-config-name"></span></h4>
                        <ul class="list-group">
                            <li name="motorType" class="list-group-item "></li>
                            <li name="carWide" class="list-group-item "></li>
                            <li name="motorBrandName" class="list-group-item "></li>
                            <li name="baoModelName" class="list-group-item "></li>
                            <li name="moduleNums" class="list-group-item "></li>
                            <li name="carTypeName" class="list-group-item "></li>
                            <li name="kindName" class="list-group-item "></li>
                        </ul>
                    </ul>
                </div>
            </div>
        </div>
    </div>
</div>
<th:block th:include="include :: footer" />
<script th:inline="javascript">
    var editFlag = [[${@permission.hasPermi('car:config:edit')}]];
    var removeFlag = [[${@permission.hasPermi('car:config:delete')}]];
    var prefix = ctx + "car/config";


    function getConfigList(id){
        //data-toggle="modal" data-target="#myModal"
        $(".getMail").attr("data-toggle","modal");
        $(".getMail").attr("data-target","#myModal");
        $.ajax({
            url:prefix+"/getConfigById/"+id,
            type:"get",
            success:function (data) {
                console.log(data)
                $("[name=main-config-name]").html(data.configName);
                $("[name=config-weight]").html("车重:"+data.carWeight);
                $("[name=carWide]").html("车宽:"+data.carWide);
                $("[name=carPassengers]").html("载客数:"+data.carPassengers);
                $("[name=chargeRatio]").html("快充倍率:"+data.chargeRatio);
                $("[name=fuelConsumptionHunder]").html("百公里燃油消耗量:"+data.fuelConsumptionHunder);
                $("[name=ratioGear]").html("各档位传动比:"+data.ratioGear);
                $("[name=rateOilRate]").html("节油率水平:"+data.rateOilRate);
                $("[name=carLong]").html("车长:"+data.carLong);
                $("[name=driverMode]").html("驱动方式:"+data.driverMode);
                $("[name=pureBatteryRange]").html("纯电续航里程:"+data.pureBatteryRange);
                $("[name=maxSpeed]").html("最高车速:"+data.maxSpeed);
                $("[name=maxSpeed30m]").html("30分钟最高车速:"+data.maxSpeed30m);
                $("[name=powerHundred]").html("百公里耗电量:"+data.powerHundred);
            },dataType:'json'
        })
    }
    function getPartConfig(id){
        $(".getConfig").attr("data-toggle","modal");
        $(".getConfig").attr("data-target","#myConfigModel");
        $.ajax({
            url: prefix + "/getPartConfigById/" + id,
            type: "get",
            success(data){
                console.log(data)
                $('[name=main-config-name]').html(data.configName);
                $('[name=motorType]').html("驱动电机类型:"+data.motorType);
                $('[name=motorBrandName]').html("驱动电机品牌名称:"+data.motorBrandName);
                $('[name=baoModelName]').html("电池包名称:"+data.baoModelName);
                $('[name=moduleNums]').html("电池包数量:"+data.moduleNums);
                $('[name=kindName]').html("车辆种类名称:"+data.kindName);
                $('[name=carTypeName]').html("车型名称:"+data.carTypeName);
            },dataType:'json'
        })
    }

    $(function() {
        var options = {
            url: prefix + "/list",
            createUrl: prefix + "/add",
            updateUrl: prefix + "/edit/{id}",
            removeUrl: prefix + "/delete",
            exportUrl: prefix + "/export",
            modalName: "车辆参数预配置记录",
            columns:[{
                checkbox:true,
                pagination:true
            },
                {
                    field:'id',
                    title:'配置ID'
                },
                {
                    field:'carTypeName',
                    title:'车辆类型'
                },
                {
                    field:'protocolNumber',
                    title:'规约号'
                },
                {
                    field:'modelFitNumber',
                    title:'车型符合型报告编号'
                },
                {
                    title:'整车参数',
                    formatter: function (value, row, index) {
                        var actions = [];
                        actions.push('<a class="getMail" onclick="getConfigList(\'' + row.id + '\')"><i class="glyphicon glyphicon-file"></i>查看基本信息</a> ');
                        return actions.join('');
                    }
                },
                {

                    title:'配置参数',
                    formatter: function (value, row, index) {
                        var actions = [];
                        actions.push('<a class="getConfig" onclick="getPartConfig(\'' + row.id + '\')"><i class="glyphicon glyphicon-file"></i>查看配置详细信息</a> ');
                        return actions.join('');
                    }
                },
                {
                    title: '操作',
                    align: 'center',
                    formatter: function (value, row, index) {
                        var actions = [];
                        actions.push('<a class="btn btn-success btn-xs ' + editFlag + '" href="javascript:void(0)" onclick="$.operate.edit(\'' + row.id + '\')"><i class="fa fa-edit"></i>编辑</a> ');
                        actions.push('<a class="btn btn-danger btn-xs ' + removeFlag + '" href="javascript:void(0)" onclick="$.operate.remove(\'' + row.id + '\')"><i class="fa fa-remove"></i>删除</a>');
                        return actions.join('');
                    }
                }
            ]
            // columns: [{
            //     checkbox: true
            // },
            //     {
            //         field: 'areaName',
            //         title: '区域名称'
            //     },
            //     {
            //         field: 'oldCarNumber',
            //         title: '老车牌号'
            //     },
            //     {
            //         field: 'newCarNumber',
            //         title: '新车牌号'
            //     },
            //     {
            //         field: 'oldVin',
            //         title: '老VIN'
            //     },
            //     {
            //         field: 'newVin',
            //         title: '新VIN'
            //     },
            //     {
            //         field: 'oldTerminalNum',
            //         title: '老终端编号'
            //     },
            //     {
            //         field: 'newTerminalNum',
            //         title: '新终端编号'
            //     },
            //     {
            //         field: 'feedbackPeopleId',
            //         title: '反馈人ID'
            //     },
            //     {
            //         field: 'feedbackPeopleName',
            //         title: '反馈人姓名'
            //     },
            //     {
            //         field: 'changePeopleId',
            //         title: '更改人ID'
            //     },
            //     {
            //         field: 'changePeopleName',
            //         title: '更改人'
            //     },
            //     {
            //         field: 'createDate',
            //         title: '日期'
            //     },
            //     {
            //         title: '操作',
            //         align: 'center',
            //         formatter: function(value, row, index) {
            //             var actions = [];
            //             // actions.push('<a class="btn btn-success btn-xs ' + editFlag + '" href="javascript:void(0)" onclick="$.operate.edit(\'' + row.id + '\')"><i class="fa fa-edit"></i>编辑</a> ');
            //             actions.push('<a class="btn btn-danger btn-xs ' + removeFlag + '" href="javascript:void(0)" onclick="$.operate.remove(\'' + row.id + '\')"><i class="fa fa-remove"></i>删除</a>');
            //             return actions.join('');
            //         }
            //     }]
        };
        $.table.init(options);

    });
</script>
</body>
</html>
